<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
  .zhuzhu{
    color: blueviolet;
  }
</style>
</head>
<body>

<p>单击按钮以交换 DIV 元素的文本：</p>

<p><button onclick="myFunction()">点击这里</button></p>

<div id="myDIV">小狗</div>

<script>
function myFunction() {
  var x = document.getElementById("myDIV");
  if (x.innerHTML === "小狗") {
    x.innerHTML = `<div class="zhuzhu">小猪</div>`;
  } else {
    x.innerHTML = `小狗`;
  }
}
</script>

</body>
</html>